import 'package:flutter/material.dart';

class CustomTableView extends StatefulWidget {
  const CustomTableView({super.key});

  @override
  State<CustomTableView> createState() => _CustomTableViewState();
}

class _CustomTableViewState extends State<CustomTableView>
    with AutomaticKeepAliveClientMixin {
  @override
  Widget build(BuildContext context) {
    super.build(context);
    return TabBarView(children: [
      CustomScrollView(
        slivers: [
          tabView(),
        ],
      ),
      CustomScrollView(
        slivers: [
          tabView(true),
        ],
      )
    ]);
  }

  Widget tabView([bool reverse = false]) {
    return SliverFixedExtentList(
      delegate: SliverChildBuilderDelegate(
        (_, index) => Container(
          key: Key('$reverse-$index'),
          color: index.isEven ? Colors.white : Colors.grey[100],
          child: Center(
            child: Text('ListTile ${reverse ? 20 - index : index + 1}'),
          ),
        ),
        childCount: 20,
      ),
      itemExtent: 60,
    );
  }

  @override
  bool get wantKeepAlive => true;
}
